<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core"
	xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/WEB-INF/templates/defaultLayout.xhtml">

	<!-- Definiendo la cabecera de la pagina -->
	<ui:define name="title">
		<h:outputText value="Apertura Cta. Ahorro" />
	</ui:define>

	<!-- Definiendo el cuerpo de la pagina -->
	<ui:define name="content">

		<h:outputStylesheet library="css" name="main.css" />

		<div>
			<br />
			<div style="margin-left: 50px;">
				<div>
					<div>
						<div class="p6n-api-consent-screen-title p6n-action-bar">TITULARES</div>

					</div>
				</div>
			</div>

			<!-- TITULARES -->
			<h:form id="formBeneficiariosTitulares">
				<div class="p6n-content ng-scope">
					<div class="p6n-content-no-nav ng-scope">
						<div class="p6n-main-pane ng-isolate-scope">
							<div class="">
								<div class="ng-scope">
									<div class="p6n-api-consent-screen-input-section"
										style="margin-top: 0px;">
										<div class="p6n-api-consent-screen-label"
											style="width: 190px;">CANTIDAD RETIRANTES</div>
										<div>
											<div>
												<h:inputText id="txtCantidadRetirantes"
													value="#{aperturaCuentaahorroBean.cantidadRetirantes}"
													required="true" requiredMessage="Ingrese cantidad"
													converterMessage="Número invalido"
													pt:placeholder="Minimo 1">
													<f:convertNumber type="number" integerOnly="true" />
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtCantidadRetirantes" />
									</div>
								</div>
								<div class="ng-scope">
									<table class="p6n-table">
										<thead>
											<tr>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Tipo
														documento </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Nro
														documento </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Apellido
														paterno </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Apellido
														materno </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Nombres </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Sexo </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link">
														F.nacimiento </a></th>
												<th class="p6n-api-list-col-status"><a
													href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Status </a></th>

												<th class="p6n-api-list-col-status"><a
													href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Status </a></th>
											</tr>
										</thead>
										<tbody>
											<h:panelGroup
												rendered="#{aperturaCuentaahorroBean.personanatural}">
												<tr class="ng-scope">
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.comboTipodocumentoPersonanatural.objectItemSelected.abreviatura}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.numeroDocumentoPersonanatural}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.apellidoPaternoPersonanatural}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.apellidoMaternoPersonanatural}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.nombresPersonanatural}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.comboSexoPersonanatural.objectItemSelected.denominacion}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.fechaNacimientoPersonanatural}">
																<f:convertDateTime pattern="dd/MM/yy" />
															</h:outputLabel>
													</a></td>
													<td colspan="2">No editable</td>
												</tr>
											</h:panelGroup>
											<h:panelGroup
												rendered="#{aperturaCuentaahorroBean.personajuridica}">
												<tr class="ng-scope">
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.comboTipodocumentoRepresentantelegal.objectItemSelected.abreviatura}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.numeroDocumentoRepresentantelegal}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.apellidoPaternoRepresentantelegal}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.apellidoMaternoRepresentantelegal}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.nombresRepresentantelegal}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.comboSexoRepresentantelegal.objectItemSelected.denominacion}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{aperturaCuentaahorroBean.fechaNacimientoRepresentantelegal}">
																<f:convertDateTime pattern="dd/MM/yy" />
															</h:outputLabel>
													</a></td>
													<td colspan="2">No editable</td>
												</tr>
											</h:panelGroup>
											<ui:repeat
												value="#{aperturaCuentaahorroBean.listTitulares()}"
												var="persona">
												<tr class="ng-scope">
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.tipodocumento.abreviatura}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.numerodocumento}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.apellidopaterno}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.apellidomaterno}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.nombres}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.sexo.denominacion}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{persona.fechanacimiento}">
																<f:convertDateTime pattern="dd/MM/yy" />
															</h:outputLabel>
													</a></td>
													<td><h:commandButton value="Edit"
															styleClass="action green" style="margin: 0px;">
															<f:ajax
																listener="#{aperturaCuentaahorroBean.editTitular(persona)}"
																render=":panelGroupDlgTitular :formDialogTitular" />
														</h:commandButton></td>
													<td><h:commandButton value="Remove"
															styleClass="action red" style="margin: 0px;">
															<f:ajax
																listener="#{aperturaCuentaahorroBean.removeTitular(persona)}"
																render="@form" />
														</h:commandButton></td>
												</tr>
											</ui:repeat>
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="p6n-content ng-scope">
					<div class="p6n-envelope">
						<div class="p6n-content-no-nav">
							<div class="p6n-main-pane p6n-acl-pane">
								<div class="p6n-action-bar" style="padding-bottom: 45px;">
									<h:commandButton value="Añadir Titular" class="actionn red">
										<f:ajax
											listener="#{aperturaCuentaahorroBean.setDlgTitularOpen(true)}"
											render=":panelGroupDlgTitular :formDialogTitular" />
									</h:commandButton>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- END TITULARES -->
				<!-- BENEFICIARIOS -->
				<br />
				<br />
				<div style="margin-left: 50px;">
					<div>
						<div>
							<div class="p6n-api-consent-screen-title p6n-action-bar">BENEFICIARIOS</div>

						</div>
					</div>
				</div>
				<div class="p6n-content ng-scope">
					<div class="p6n-content-no-nav ng-scope">
						<div class="p6n-main-pane ng-isolate-scope">
							<div class="">
								<div class="ng-scope">
									<table class="p6n-table">
										<thead>
											<tr>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Nro
														documento </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Apellido
														paterno </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Apellido
														materno </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Nombres </a></th>
												<th><a href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Porcentaje
												</a></th>
												<th class="p6n-api-list-col-status"><a
													href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Status </a></th>
												<th class="p6n-api-list-col-status"><a
													href="javascript:;"
													class="ng-isolate-scope p6n-clickable-link"> Status </a></th>
											</tr>
										</thead>
										<tbody>
											<ui:repeat
												value="#{aperturaCuentaahorroBean.listBeneficiarios()}"
												var="beneficiario">
												<tr class="ng-scope">
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{beneficiario.dni}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{beneficiario.apellidopaterno}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{beneficiario.apellidomaterno}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{beneficiario.nombres}" />
													</a></td>
													<td><a href="javascript:;"
														class="p6n-clickable-link ng-binding"> <h:outputLabel
																value="#{beneficiario.porcentajebeneficio}%" />
													</a></td>
													<td><h:commandButton value="Edit"
															styleClass="action green" style="margin: 0px;">
															<f:ajax
																listener="#{aperturaCuentaahorroBean.editBeneficiario(beneficiario)}"
																render=":panelGroupDlgBeneficiario :formDialogBeneficiario" />
														</h:commandButton></td>
													<td><h:commandButton value="Remove"
															styleClass="action red" style="margin: 0px;">
															<f:ajax
																listener="#{aperturaCuentaahorroBean.removeBeneficiario(beneficiario)}"
																render="@form" />
														</h:commandButton></td>
												</tr>
											</ui:repeat>
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="p6n-content ng-scope">
					<div class="p6n-envelope">
						<div class="p6n-content-no-nav">
							<div class="p6n-main-pane p6n-acl-pane">
								<div class="p6n-action-bar" style="padding-bottom: 45px;">
									<h:commandButton value="Añadir Beneficiario"
										class="actionn red">
										<f:ajax
											listener="#{aperturaCuentaahorroBean.setDlgBeneficiarioOpen(true)}"
											render=":panelGroupDlgBeneficiario :formDialogBeneficiario" />
									</h:commandButton>
								</div>
							</div>
						</div>
					</div>

				</div>
				<!-- END BENEFICIARIOS -->

				<div class="sf-buttons" style="float: left;">
					<h:panelGroup rendered="#{aperturaCuentaahorroBean.personanatural}">
						<h:commandButton value="« Anterior" immediate="true"
							action="aperturaCuentaahorro-flow" styleClass="action" />
						<h:commandButton value="Siguiente »"
							action="aperturaCuentaahorro-flowC"
							actionListener="#{aperturaCuentaahorroBean.addTitularDefecto()}"
							styleClass="action" />
					</h:panelGroup>
					<h:panelGroup
						rendered="#{aperturaCuentaahorroBean.personajuridica}">
						<h:commandButton value="« Anterior"
							action="aperturaCuentaahorro-flowA" styleClass="action" />
						<h:commandButton value="Siguiente »"
							action="aperturaCuentaahorro-flowC"
							actionListener="#{aperturaCuentaahorroBean.addTitularDefecto()}"
							styleClass="action" />
					</h:panelGroup>

				</div>

			</h:form>



			<h:panelGroup id="panelGroupDlgTitular">
				<h:panelGroup rendered="#{aperturaCuentaahorroBean.dlgTitularOpen}">
					<div class="modal-dialog-bg"
						style="opacity: 0.4; width: 1366px; height: 702px;"></div>
					<div class="modal-dialog p6n-popup" style="left: 402px; top: 50px;">
						<h:form id="formDialogTitular">
							<div class="modal-dialog-content p6n-acl-add-member-popup"
								style="width: 385px;">
								<div class="p6n-api-consent-screen-inputs">
									<div class="sf-separator">
										<h3 class="p6n-api-consent-screen-title">Datos generales</h3>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label">TIPO
												DOCUMENTO</div>
											<div>
												<h:selectOneMenu id="cmbTipodocumentoTitular"
													value="#{aperturaCuentaahorroBean.comboTipodocumentoTitular.itemSelected}"
													valueChangeListener="#{aperturaCuentaahorroBean.changeTipodocumentoTitular}"
													required="true"
													requiredMessage="Seleccione tipo de documento">
													<f:selectItem itemLabel="--SELECCIONE--" itemValue="" />
													<f:selectItems
														value="#{aperturaCuentaahorroBean.comboTipodocumentoTitular.items.entrySet()}"
														var="val" itemLabel="#{val.value.abreviatura}"
														itemValue="#{val.key}" />
													<f:ajax></f:ajax>
												</h:selectOneMenu>
											</div>
										</div>
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 180px;">NUMERO DOCUMENTO</div>
											<div>
												<h:inputText id="txtDniTitular"
													value="#{aperturaCuentaahorroBean.numeroDocumentoTitular}"
													required="true" maxlength="15"
													requiredMessage="Ingrese numero documento"
													validatorMessage="Número de documento Invalido"
													converterMessage="Número de documento Invalido"
													onkeypress="if (event.keyCode == 13) {onchange(); return false; }"
													pt:placeholder="12345678">
													<f:convertNumber type="number" integerOnly="true" />
													<f:ajax
														listener="#{aperturaCuentaahorroBean.buscarPersonanaturalTitular()}"
														render="@form"></f:ajax>
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="cmbTipodocumentoTitular" />
										<h:message for="txtDniTitular" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 190px;">APELLIDO PATERNO</div>
											<div>
												<div>
													<h:inputText id="txtApellidoPaternoTitular"
														value="#{aperturaCuentaahorroBean.apellidoPaternoTitular}"
														required="true" maxlength="50"
														requiredMessage="Ingrese apellido paterno"
														onkeyup="this.value = this.value.toUpperCase();"
														pt:placeholder="Apellido paterno">
													</h:inputText>
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 180px;">APELLIDO MATERNO</div>
											<div>
												<div>
													<h:inputText id="txtApellidoMaternoTitular"
														value="#{aperturaCuentaahorroBean.apellidoMaternoTitular}"
														required="true" maxlength="50"
														requiredMessage="Ingrese apellido materno"
														onkeyup="this.value = this.value.toUpperCase();"
														pt:placeholder="Apellido materno">
													</h:inputText>
												</div>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtApellidoPaternoTitular" />
										<h:message for="txtApellidoMaternoTitular" />
									</div>
									<div class="p6n-api-consent-screen-input-section"
										style="width: 190px;">
										<div class="p6n-api-consent-screen-label"
											style="width: 190px;">NOMBRES</div>
										<div>
											<div>
												<h:inputText id="txtNombresTitular"
													value="#{aperturaCuentaahorroBean.nombresTitular}"
													required="true" maxlength="50"
													requiredMessage="Ingrese nombres"
													onkeyup="this.value = this.value.toUpperCase();"
													style="width:339px;" pt:placeholder="Nombres">
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtNombresTitular" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 190px;">SEXO</div>
											<div>
												<div>
													<h:selectOneMenu id="cmbSexoTitular"
														value="#{aperturaCuentaahorroBean.comboSexoTitular.itemSelected}"
														required="true" requiredMessage="Seleccione sexo">
														<f:selectItem itemLabel="--Seleccione--" itemValue="" />
														<f:selectItems
															value="#{aperturaCuentaahorroBean.comboSexoTitular.items.entrySet()}"
															var="val" itemLabel="#{val.value.denominacion}"
															itemValue="#{val.key}" />
													</h:selectOneMenu>
												</div>
											</div>
										</div>
										<div style="display: inline-block;">
											<div class="p6n-api-consent-screen-label"
												style="width: 180px;">FECHA DE NACIMIENTO</div>
											<div>
												<div>
													<p:calendar id="txtFechanacimientoTitular"
														value="#{aperturaCuentaahorroBean.fechaNacimientoTitular}"
														navigator="true" pattern="dd/MM/yy" required="true"
														requiredMessage="Ingrese fecha de nacimiento"
														converterMessage="formato incorrecto"
														pt:placeholder="dd/mm/yyyy">
														<f:convertDateTime pattern="dd/MM/yy" />
													</p:calendar>
												</div>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="cmbSexoTitular" />
										<h:message for="txtFechanacimientoTitular" />
									</div>
								</div>
								<br />
							</div>

							<div class="modal-dialog-buttons">
								<h:commandButton value="Guardar" styleClass="action blue">
									<f:ajax listener="#{aperturaCuentaahorroBean.addTitular()}"
										execute="@form" render="@form :formBeneficiariosTitulares" />
								</h:commandButton>
								<h:commandButton value="Cancelar" styleClass="action">
									<f:ajax
										listener="#{aperturaCuentaahorroBean.setDlgTitularOpen(false)}"
										render="@form :panelGroupDlgTitular" />
								</h:commandButton>
							</div>
						</h:form>
					</div>
				</h:panelGroup>
			</h:panelGroup>
			<h:panelGroup id="panelGroupDlgBeneficiario">
				<h:panelGroup
					rendered="#{aperturaCuentaahorroBean.dlgBeneficiarioOpen}">
					<div class="modal-dialog-bg"
						style="opacity: 0.4; width: 1366px; height: 702px;"></div>
					<div class="modal-dialog p6n-popup" style="left: 402px; top: 50px;">
						<h:form id="formDialogBeneficiario">
							<div class="modal-dialog-content p6n-acl-add-member-popup"
								style="width: 385px;">
								<div class="p6n-api-consent-screen-inputs">
									<div class="sf-separator">
										<h3 class="p6n-api-consent-screen-title">Beneficiario</h3>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div class="p6n-api-consent-screen-label">NUMERO
											DOCUMENTO</div>
										<div>
											<h:inputText id="txtNumerodocumentoBeneficiario"
												value="#{aperturaCuentaahorroBean.numeroDocumentoBeneficiario}"
												maxlength="15"
												validatorMessage="Número de documento Invalido"
												converterMessage="Número de documento Invalido"
												pt:placeholder="12345678">
												<f:convertNumber type="number" integerOnly="true" />
											</h:inputText>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtNumerodocumentoBeneficiario" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 190px;">APELLIDO PATERNO</div>
											<div>
												<div>
													<h:inputText id="txtApellidoPaternoBeneficiario"
														value="#{aperturaCuentaahorroBean.apellidoPaternoBeneficiario}"
														required="true" maxlength="50"
														requiredMessage="Ingrese apellido paterno"
														onkeyup="this.value = this.value.toUpperCase();"
														pt:placeholder="Apellido paterno">
													</h:inputText>
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 190px;">
											<div class="p6n-api-consent-screen-label"
												style="width: 180px;">APELLIDO MATERNO</div>
											<div>
												<div>
													<h:inputText id="txtApellidoMaternoBeneficiario"
														value="#{aperturaCuentaahorroBean.apellidoMaternoBeneficiario}"
														required="true" maxlength="50"
														requiredMessage="Ingrese apellido materno"
														onkeyup="this.value = this.value.toUpperCase();"
														pt:placeholder="Apellido materno">
													</h:inputText>
												</div>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtApellidoPaternoBeneficiario" />
										<h:message for="txtApellidoMaternoBeneficiario" />
									</div>
									<div class="p6n-api-consent-screen-input-section"
										style="width: 190px;">
										<div class="p6n-api-consent-screen-label"
											style="width: 190px;">NOMBRES</div>
										<div>
											<div>
												<h:inputText id="txtNombresBeneficiario"
													value="#{aperturaCuentaahorroBean.nombresBeneficiario}"
													required="true" maxlength="50"
													requiredMessage="Ingrese nombres"
													onkeyup="this.value = this.value.toUpperCase();"
													style="width:339px;" pt:placeholder="Nombres">
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtNombresBeneficiario" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div class="p6n-api-consent-screen-label"
											style="width: 190px;">PORCENTAJE BENEFICIO</div>
										<div>
											<div>
												<h:inputText id="txtPorcentajebeneficiarioBeneficiario"
													value="#{aperturaCuentaahorroBean.porcentajeBeneficio}"
													maxlength="2" pt:placeholder="(%)">
													<f:convertNumber type="number" integerOnly="true" />
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtPorcentajebeneficiarioBeneficiario" />
									</div>
								</div>
								<br />
							</div>
							<div class="modal-dialog-buttons">
								<h:commandButton value="Guardar" styleClass="action blue">
									<f:ajax
										listener="#{aperturaCuentaahorroBean.addBeneficiario()}"
										execute="@form" render="@form :formBeneficiariosTitulares" />
								</h:commandButton>
								<h:commandButton value="Cancelar" styleClass="action">
									<f:ajax
										listener="#{aperturaCuentaahorroBean.setDlgBeneficiarioOpen(false)}"
										render="@form :panelGroupDlgBeneficiario" />
								</h:commandButton>
							</div>
						</h:form>

					</div>
				</h:panelGroup>
			</h:panelGroup>
		</div>
	</ui:define>

</ui:composition>
</html>